<template>
  <a-card :bordered="false" class="card-area">
    <div :class="advanced ? 'search' : null">
      <!-- 搜索区域 -->
      <a-form layout="horizontal">
        <div :class="advanced ? null : 'fold'">
          <a-row>
            <a-col :md="12" :sm="24">
              <a-form-item label="法人行" :labelCol="{ span: 5 }" :wrapperCol="{ span: 18, offset: 1 }">
                <a-select mode="default" :allowClear="true" style="width: 100%" @change="handleInstChange"
                  v-model="queryParams.instId">
                  <a-select-option v-for="r in instIdData" :key="r.label">{{ r.label }}-{{ r.value }}</a-select-option>
                </a-select>
                <!-- <a-input v-if="!this.user.admin" v-model="queryParams.instId" :value="this.user.instId"
                         readonly="readonly"/>-->
              </a-form-item>
            </a-col>
            <a-col :md="12" :sm="24" v-show="queryParams.instId != ''">
              <a-form-item label="设备类型" :labelCol="{ span: 5 }" :wrapperCol="{ span: 18, offset: 1 }">
                <a-select mode="default" :allowClear="true" style="width: 100%" show-search placeholder="请选择"
                  option-filter-prop="children" :filter-option="filterOption" v-model="queryParams.bindDevType">
                  <a-select-option key="01">手机设备</a-select-option>
                  <a-select-option key="02">语音设备</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
          <a-row v-show="queryParams.instId != ''">
            <a-col :md="12" :sm="24">
              <a-form-item label="推送渠道" :labelCol="{ span: 5 }" :wrapperCol="{ span: 18, offset: 1 }">
                <a-select mode="default" :allowClear="true" style="width: 100%" show-search placeholder="请选择"
                  option-filter-prop="children" :filter-option="filterOption" v-model="queryParams.msgPushKey">
                  <a-select-option key="01">阿里云</a-select-option>
                  <a-select-option key="02">信雅达</a-select-option>
                  <a-select-option key="03">意锐</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :md="12" :sm="24">
              <a-form-item label="绑定商户" :labelCol="{ span: 5 }" :wrapperCol="{ span: 18, offset: 1 }">
                <a-select show-search placeholder="请输入代码或名称" option-filter-prop="children" style="width: 100%"
                  :allowClear="true" :filter-option="filterOption" @focus="selectBindMchntN" @search="selectBindMchntN"
                  v-model="queryParams.mchntNo">
                  <a-select-option v-for="(d, index) in bindMchntNData" :key="d.mchntNo">
                    {{ d.mchntNo }}-{{ d.mchntName }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
          <a-row v-show="queryParams.instId != ''">
            <a-col :md="12" :sm="24">
              <a-form-item label="绑定状态" :labelCol="{ span: 5 }" :wrapperCol="{ span: 18, offset: 1 }">
                <a-select mode="default" :allowClear="true" style="width: 100%" show-search placeholder="请选择"
                  option-filter-prop="children" :filter-option="filterOption" v-model="queryParams.bindStatus">
                  <a-select-option key="00">绑定</a-select-option>
                  <a-select-option key="01">解绑</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
        </div>
        <div style="text-align: center;" v-show="queryParams.instId != ''">
          <a-button type="primary" @click="search">查询</a-button>
          <a-button style="margin-left: 8px" @click="reset">重置</a-button>
        </div>
      </a-form>
    </div>
    <div v-show="queryParams.instId != ''">
      <div class="operator">
        <a-button v-hasPermission="['devBindInfo:add']" ghost type="primary" @click="add">新增</a-button>
        <a-button v-hasPermission="['devBindInfo:cancel']" ghost type="primary" @click="cancel">注销</a-button>
        <a-button v-hasPermission="['devBindInfo:stop']" ghost type="primary" @click="stopUse">停用</a-button>
        <a-button v-hasPermission="['devBindInfo:use']" ghost type="primary" @click="use">启用</a-button>
        <a-button v-hasPermission="['devBindInfo:bind']" ghost type="primary" @click="bindStatus">绑定</a-button>
        <a-button v-hasPermission="['devBindInfo:unbind']" ghost type="primary" @click="unbind">解绑</a-button>
        <a-button v-hasPermission="['devBindInfo:import']" ghost type="primary" @click="upload">导入</a-button>

      </div>
      <!-- 表格区域 -->
      <a-table ref="TableInfo" :columns="columns" :rowKey="record => record.id" :dataSource="dataSource"
        :pagination="pagination" :loading="loading"
        :rowSelection="{ onChange: onSelectChange, selectedRowKeys: selectedRowKeys, type: 'radio' }"
        :scroll="{ x: 2200 }" @change="handleTableChange">
        <template slot="email" slot-scope="text, record">
          <a-popover placement="topLeft">
            <template slot="content">
              <div>{{ text }}</div>
            </template>
            <p style="width: 150px;margin-bottom: 0">{{ text }}</p>
          </a-popover>
        </template>
        <template slot="operation" slot-scope="text, record">
          <a-icon v-hasPermission="['devBindInfo:edit']" type="setting" theme="twoTone" twoToneColor="#4a9ff5"
            @click="editInfo(record)" title="修改"></a-icon>&nbsp;
          <a-icon v-hasPermission="['devBindInfo:view']" type="eye" theme="twoTone" twoToneColor="#42b983"
            @click="viewInfo(record)" title="查看"></a-icon>
          <a-badge v-hasNoPermission="['devBindInfo:edit', 'devBindInfo:view']" userStatus="warning" text="无权限">
          </a-badge>
        </template>

      </a-table>
      <!-- 信息查看 -->
      <dev-bind-info-info ref="devBindInfoInfo" @close="handleDevBindInfoInfoClose"
        :devBindInfoInfoVisiable="devBindInfoInfo.visiable">
      </dev-bind-info-info>
      <!-- 新增信息 -->
      <dev-bind-info-add @close="handleDevBindInfoAddClose" @success="handleDevBindInfoAddSuccess"
        :devBindInfoAddVisiable="devBindInfoAdd.visiable" :instId="this.queryParams.instId">
      </dev-bind-info-add>
      <!-- 注销信息 -->
      <dev-bind-info-cancel ref="devBindInfoCancel" @close="handleDevBindInfoCancelClose"
        @success="handleDevBindInfoCancelSuccess" :devBindInfoCancelVisiable="devBindInfoCancel.visiable"
        :instId="this.queryParams.instId">
      </dev-bind-info-cancel>
      <!-- 停用信息 -->
      <dev-bind-info-stop ref="devBindInfoStop" @close="handleDevBindInfoStopUseClose"
        @success="handleDevBindInfoStopUseSuccess" :devBindInfoStopVisiable="devBindInfoStop.visiable"
        :instId="this.queryParams.instId">
      </dev-bind-info-stop>
      <!-- 使用信息 -->
      <dev-bind-info-use ref="devBindInfoUse" @close="handleDevBindInfoUseClose" @success="handleDevBindInfoUseSuccess"
        :devBindInfoUseVisiable="devBindInfoUse.visiable" :instId="this.queryParams.instId">
      </dev-bind-info-use>
      <!-- 绑定信息 -->
      <dev-bind-info-bind ref="devBindInfoBind" @close="handleDevBindInfoBindClose"
        @success="handleDevBindInfoBindSuccess" :devBindInfoBindVisiable="devBindInfoBind.visiable"
        :instId="this.queryParams.instId">
      </dev-bind-info-bind>
      <!-- 解绑信息 -->
      <dev-bind-info-unbind ref="devBindInfoUnbind" @close="handleDevBindInfoUnbindClose"
        @success="handleDevBindInfoUnbindSuccess" :devBindInfoUnbindVisiable="devBindInfoUnbind.visiable"
        :instId="this.queryParams.instId">
      </dev-bind-info-unbind>
      <!-- 信息导入 -->
      <dev-bind-info-import @close="handleDevBindInfoImportClose"
        :devBindInfoUploadVisiable="devBindInfoUpload.visiable" :instId="this.queryParams.instId">
      </dev-bind-info-import>

      <!-- 修改信息 -->
      <dev-bind-info-edit ref="devBindInfoEdit" @close="handleDevBindInfoEditClose"
        @success="handleDevBindInfoEditSuccess" :devBindInfoEditVisiable="devBindInfoEdit.visiable"
        :instId="this.queryParams.instId">
      </dev-bind-info-edit>
    </div>
  </a-card>
</template>

<script>
import RangeDate from '@/components/datetime/RangeDate';
import DevBindInfoAdd from "./DevBindInfoAdd";
import DevBindInfoEdit from "./DevBindInfoEdit";
import DevBindInfoInfo from "./DevBindInfoInfo";
import DevBindInfoImport from "./DevBindInfoImport";
import DevBindInfoCancel from "./DevBindInfoCancel";
import DevBindInfoUse from "./DevBindInfoUse";
import DevBindInfoStop from "./DevBindInfoStop";
import DevBindInfoBind from "./DevBindInfoBind";
import DevBindInfoUnbind from "./DevBindInfoUnbind";

import { mapState } from "vuex"

export default {
  name: "devBindInfo",
  components: {
    RangeDate, DevBindInfoAdd, DevBindInfoEdit, DevBindInfoInfo, DevBindInfoImport, DevBindInfoCancel,
    DevBindInfoUse, DevBindInfoStop, DevBindInfoBind, DevBindInfoUnbind
  },
  data() {
    return {
      advanced: false,
      devBindInfoInfo: {
        visiable: false,
        data: {}
      },
      devBindInfoAdd: {
        visiable: false
      },
      devBindInfoCancel: {
        visiable: false,
        data: {}
      },
      devBindInfoStop: {
        visiable: false,
        data: {}
      },
      devBindInfoUse: {
        visiable: false,
        data: {}
      },
      devBindInfoUpload: {
        visiable: false
      },
      devBindInfoEdit: {
        visiable: false
      },
      devBindInfoBind: {
        visiable: false
      },
      devBindInfoUnbind: {
        visiable: false
      },

      queryParams: {
        bindDevType: '',
        remark5:'',
        bindStatus: '',
        msgPushKey: '',
        mchntNo: '',
        instId: ''
      },
      bindMchntNData: [],
      dataSource: [],
      sortedInfo: null,
      paginationInfo: null,
      selectedRowKeys: [],
      pagination: {
        pageSizeOptions: ['10', '20', '30', '40', '100'],
        defaultCurrent: 1,
        defaultPageSize: 10,
        showQuickJumper: true,
        showSizeChanger: true,
        showTotal: (total, range) => `显示 ${range[0]} ~ ${range[1]} 条记录，共 ${total} 条记录`
      },
      loading: false,
      instIdData: [],
      da: []
    }
  },
  computed: {
    ...mapState({
      user: state => state.account.user,

    }),
    columns() {
      let { sortedInfo } = this
      sortedInfo = sortedInfo || {}
      let { filteredInfo } = this
      filteredInfo = filteredInfo || {}
      return [{
        title: '法人行',
        dataIndex: 'instId',
        scopedSlots: { customRender: 'instId' },
      }, {
        title: '绑定设备类型',
        dataIndex: 'bindDevType',
        customRender: (text, row, index) => {
          switch (text) {
            case '01':
              return <a-tag color="pink" > 手机设备 </a-tag>
            case '02':
              return <a-tag color="pink" > 语音设备 </a-tag>
            default:
              return text
          }
        },
        filters: [
          { text: '手机设备', value: '01' },
          { text: '语音设备', value: '02' },
        ],
        filterMultiple: false,
        filteredValue: filteredInfo.bindDevType || null,
        onFilter: (value, record) => record.bindDevType.includes(value)
      }, {
        title: '产品/品牌代码',
        dataIndex: 'bindDevBrand',
        scopedSlots: { customRender: 'bindDevBrand' },
      }, {
        title: '设备名称',
        dataIndex: 'bindDevModel',
        scopedSlots: { customRender: 'bindDevModel' },
      }, {
        title: '绑定日期',
        dataIndex: 'bindDate',
        scopedSlots: { customRender: 'bindDate' },
      }, {
        title: '绑定时间',
        dataIndex: 'bindTime',
        scopedSlots: { customRender: 'bindTime' },
      }, {
        title: '绑定类型',
        dataIndex: 'remark5',
        customRender: (text, row, index) => {
          switch (text) {
            case '00':
              return <a-tag color="pink" > 收银员 </a-tag>
            case '01':
              return <a-tag color="pink" > 商户 </a-tag>
            default:
              return text
          }
        },
        // filters: [
        //   { text: '收银员', value: '00' },
        //   { text: '商户', value: '01' },
        // ],
        // filterMultiple: false,
        // filteredValue: filteredInfo.remark5 || null,
        // onFilter: (value, record) => {
        //   if(record.remark5){
        //  return record.remark5.includes(value)}
        //   }
      }, {
        title: '商户/门店编码',
        dataIndex: 'bindMchntNo',
        scopedSlots: { customRender: 'bindMchntNo' },
      }, {
        title: '商户名称',
        dataIndex: 'mchntName',
        scopedSlots: { customRender: 'mchntName' },
      }, {
        title: '绑定用户标识',
        dataIndex: 'bindUserId',
        scopedSlots: { customRender: 'bindUserId' },
      }, {
        title: '绑定收银员',
        dataIndex: 'bindNickName',
        scopedSlots: { customRender: 'bindNickName' },
      }, {
        title: '推送渠道开关',
        dataIndex: 'msgPushFlag',
        scopedSlots: { customRender: 'msgPushFlag' },
      }, {
        title: '推送渠道',
        dataIndex: 'msgPushKey',
        customRender: (text, row, index) => {
          switch (text) {
            case '01':
              return <a-tag color="pink" > 阿里云 </a-tag>
            case '02':
              return <a-tag color="pink" > 信雅达 </a-tag>
            case '03':
              return <a-tag color="pink" > 意税 </a-tag>
            default:
              return text
          }
        },
        filters: [
          { text: '阿里云', value: '01' },
          { text: '信雅达', value: '02' },
          { text: '意税', value: '03' },
        ],
        filterMultiple: false,
        filteredValue: filteredInfo.msgPushKey || null,
        onFilter: (value, record) =>{
          if(record.msgPushKey){
            return record.msgPushKey.includes(value)
          }
        } 
      }, {
        title: '绑定状态',
        dataIndex: 'bindStatus',
        customRender: (text, row, index) => {
          switch (text) {
            case '00':
              return <a-tag color="pink" > 绑定 </a-tag>
            case '01':
              return <a-tag color="pink" > 解绑 </a-tag>
            default:
              return text
          }
        },
        filters: [
          { text: '绑定', value: '00' },
          { text: '解绑', value: '01' },
        ],
        filterMultiple: false,
        filteredValue: filteredInfo.bindStatus || null,
        onFilter: (value, record) => record.bindStatus.includes(value)
      }, {
        title: '审核状态',
        dataIndex: 'auditStatus',
        customRender: (text, row, index) => {
          switch (text) {
            case '00':
              return <a-tag color="cyan" > 待提交审批 </a-tag>
            case '01':
              return <a-tag color="pink" > 新增-审批流程中 </a-tag>
            case '02':
              return <a-tag color="pink" > 新增-审批通过 </a-tag>
            case '03':
              return <a-tag color="pink" > 新增-审批拒绝 </a-tag>
            case '11':
              return <a-tag color="cyan" > 注销-审批流程中 </a-tag>
            case '12':
              return <a-tag color="pink" > 注销-审批通过 </a-tag>
            case '13':
              return <a-tag color="pink" > 注销-审批拒绝 </a-tag>
            case '21':
              return <a-tag color="pink" > 停用-审批流程中 </a-tag>
            case '22':
              return <a-tag color="cyan" > 停用-审批通过 </a-tag>
            case '23':
              return <a-tag color="pink" > 停用-审批拒绝 </a-tag>
            case '31':
              return <a-tag color="pink" > 启用-审批流程中 </a-tag>
            case '32':
              return <a-tag color="pink" > 启用-审批通过 </a-tag>
            case '33':
              return <a-tag color="cyan" > 启用-审批拒绝 </a-tag>
            case '41':
              return <a-tag color="pink" > 修改-审批流程中 </a-tag>
            case '42':
              return <a-tag color="pink" > 修改-审批通过 </a-tag>
            case '43':
              return <a-tag color="pink" > 修改-审批拒绝 </a-tag>
            default:
              return text
          }
        },
        // filters: [
        //   { text: '待提交审批', value: '00' },
        //   { text: '新增-审批流程中', value: '01' },
        //   { text: '新增-审批通过', value: '02' },
        //   { text: '新增-审批拒绝', value: '03' },
        //   { text: '注销-审批流程中', value: '11' },
        //   { text: '注销-审批通过', value: '12' },
        //   { text: '注销-审批拒绝', value: '13' },
        //   { text: '停用-审批流程中', value: '21' },
        //   { text: '停用-审批通过', value: '22' },
        //   { text: '停用-审批拒绝', value: '23' },
        //   { text: '启用-审批流程中', value: '31' },
        //   { text: '启用-审批通过', value: '32' },
        //   { text: '启用-审批拒绝', value: '33' },
        //   { text: '修改-审批流程中', value: '41' },
        //   { text: '修改-审批通过', value: '42' },
        //   { text: '修改-审批拒绝', value: '43' }
        // ],
        // filterMultiple: false,
        // filteredValue: filteredInfo.auditStatus || null,
        // onFilter: (value, record) => record.auditStatus.includes(value)
      }, {
        title: '设备状态',
        dataIndex: 'recordStatus',
        customRender: (text, row, index) => {
          switch (text) {
            case 'Y':
              return <a-tag color="pink" > 启用 </a-tag>
            case 'N':
              return <a-tag color="pink" > 停用 </a-tag>
            default:
              return text
          }
        },
        // filters: [
        //   { text: '启用', value: 'Y' },
        //   { text: '停用', value: 'N' },
        // ],
        // filterMultiple: false,
        // filteredValue: filteredInfo.recordStatus || null,
        // onFilter: (value, record) => record.recordStatus.includes(value)
      }, {
        title: '操作',
        dataIndex: 'operation',
        fixed: 'right',
        scopedSlots: { customRender: 'operation' }
      }]
    }
  },
  mounted() {
    this.$get('admin/upmporg/getInstList').then((r) => {
      this.instIdData = r.data
    })
  },
  methods: {
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },

    selectBindMchntN(val) {
      this.bindMchntNData = []
      if (this.queryParams.instId) {
        let param = {}
        if (val) {
          param = {
            q: encodeURIComponent(val + `&${this.queryParams.instId}`),
            pageSize: 20
          }
        } else {
          param = {
            q: encodeURIComponent(`&${this.queryParams.instId}`),
            pageSize: 20
          }
        }

        this.$get('admin/mcmp/bMchntBaseInfo/mchntFormalSelect2List', param).then((r) => {
          let result = r.data.rows
          result.forEach(r => {
            this.bindMchntNData.push(r);
          })
        })

      } else {
        this.$message.warning('请先选择法人行！')
      }
    },

    onSelectChange(selectedRowKeys) {  //接收数组，存放到前面定义的数组中
      this.selectedRowKeys = selectedRowKeys;
    },


    add() {
      this.devBindInfoAdd.visiable = true
    },

    cancel() {
      if (!this.selectedRowKeys.length) {
        this.$message.warning('请选择需要注销的记录')
        return
      }
      let selectedIndex = ''
      this.dataSource.map((val, index) => {
        // console.log(val.id, this.selectedRowKeys[0])
        if (val.id === this.selectedRowKeys[0]) return selectedIndex = index
      })
      // console.log(selectedIndex)
      let record = this.dataSource[selectedIndex]
      // console.log(record)
      if (record.auditStatus === '12') {
        this.$message.warning('注销通过的数据不允许再注销')
        return
      }

      let bindMchntNo = record.bindMchntNo
      if (bindMchntNo) {
        record.mchntNo = record.bindMchntNo + '-' + record.mchntName
      }
      record.bindType = record.remark5
      this.$refs.devBindInfoCancel.setDevBindInfoFormValues(record)
      this.devBindInfoCancel.visiable = true
    },
    bindStatus() {
      if (!this.selectedRowKeys.length) {
        this.$message.warning('请选择需要绑定的记录')
        return
      }
      let selectedIndex = ''
      this.dataSource.map((val, index) => {
        // console.log(val.id, this.selectedRowKeys[0])
        if (val.id === this.selectedRowKeys[0]) return selectedIndex = index
      })
      // console.log(selectedIndex)
      let record = this.dataSource[selectedIndex]
      // console.log(record)
      if (record.bindStatus === '00') {
        this.$message.warning('已绑定的数据不允许再绑定')
        return
      }

      let bindMchntNo = record.bindMchntNo
      if (bindMchntNo) {
        record.mchntNo = record.bindMchntNo + '-' + record.mchntName
      }
      record.bindType = record.remark5
      this.$refs.devBindInfoBind.setDevBindInfoFormValues(record)
      this.devBindInfoBind.visiable = true
    },
    unbind() {
      if (!this.selectedRowKeys.length) {
        this.$message.warning('请选择需要解绑的记录')
        return
      }
      let selectedIndex = ''
      this.dataSource.map((val, index) => {
        // console.log(val.id, this.selectedRowKeys[0])
        if (val.id === this.selectedRowKeys[0]) return selectedIndex = index
      })
      // console.log(selectedIndex)
      let record = this.dataSource[selectedIndex]
      // console.log(record)
      if (record.bindStatus === '01') {
        this.$message.warning('已解绑的数据不允许再解绑')
        return
      }

      let bindMchntNo = record.bindMchntNo
      if (bindMchntNo) {
        record.mchntNo = record.bindMchntNo + '-' + record.mchntName
      }
      record.bindType = record.remark5
      this.$refs.devBindInfoUnbind.setDevBindInfoFormValues(record)
      this.devBindInfoUnbind.visiable = true
    },

    stopUse() {
      if (!this.selectedRowKeys.length) {
        this.$message.warning('请选择需要停用的数据')
        return
      }
      let selectedIndex = ''
      this.dataSource.map((val, index) => {
        if (val.id === this.selectedRowKeys[0]) return selectedIndex = index
      })
      let record = this.dataSource[selectedIndex]
      if (record.auditStatus === '12') {
        this.$message.warning('注销通过的数据不允许再停用')
        return
      }
      if (record.recordStatus == 'N') {
        this.$message.warning('数据已停用')
        return
      }
      if (record.auditStatus === '22') {
        this.$message.warning('停用的数据不允许再停用')
        return
      }

      let bindMchntNo = record.bindMchntNo
      if (bindMchntNo) {
        record.mchntNo = record.bindMchntNo + '-' + record.mchntName
      }
      record.bindType = record.remark5
      this.$refs.devBindInfoStop.setDevBindInfoFormValues(record)
      this.devBindInfoStop.visiable = true
    },

    use() {
      if (!this.selectedRowKeys.length) {
        this.$message.warning('请选择需要启用的数据')
        return
      }

      let selectedIndex = ''
      this.dataSource.map((val, index) => {
        // console.log(val.id, this.selectedRowKeys[0])
        if (val.id === this.selectedRowKeys[0]) return selectedIndex = index
      })
      let record = this.dataSource[selectedIndex]
      if (record.auditStatus === '12') {
        this.$message.warning('注销通过的数据不允许再启用')
        return
      }
      if (record.recordStatus == 'Y') {
        this.$message.warning('"数据已启用"')
        return
      }
      let bindMchntNo = record.bindMchntNo
      if (bindMchntNo) {
        record.mchntNo = record.bindMchntNo + '-' + record.mchntName
      }
      record.bindType = record.remark5
      this.$refs.devBindInfoUse.setDevBindInfoFormValues(record)
      this.devBindInfoUse.visiable = true
    },


    upload() {
      this.devBindInfoUpload.visiable = true
    },

    //查数据
    handleInstChange(value) {
      this.queryParams.instId = value;
      if (value != "") {
        let params = {}
        params.instId = value;
        this.$get('devBindInfo', { ...params }).then((r) => {
          for (var i = 0; i < r.data.rows.length; i++) {
            r.data.rows[i].id = i
          }
          // console.log(r.data.rows)
          this.dataSource = r.data.rows;
          this.search()
        })
      }
    },

    handleDevBindInfoAddClose() {
      this.devBindInfoAdd.visiable = false
    },
    handleDevBindInfoAddSuccess() {
      this.devBindInfoAdd.visiable = false
      this.$message.success('新增语音设备信息成功')
      this.search()
    },

    handleDevBindInfoStopUseClose() {
      this.devBindInfoStop.visiable = false

      this.search()
    },
    handleDevBindInfoStopUseSuccess() {
      this.devBindInfoStop.visiable = false
      this.$message.success('停用语音设备信息成功')

      this.search()
    },
    handleDevBindInfoCancelClose() {
      this.devBindInfoCancel.visiable = false
      this.search()
    },
    handleDevBindInfoCancelSuccess() {
      // console.log(this.devBindInfoCancel.visiable, 'rrr')
      this.devBindInfoCancel.visiable = false
      this.$message.success('注销语音设备信息成功')
      this.search()
    },
    handleDevBindInfoBindClose() {
      this.devBindInfoBind.visiable = false
      this.search()
    },
    handleDevBindInfoBindSuccess() {
      // console.log(this.devBindInfoCancel.visiable, 'rrr')
      this.devBindInfoBind.visiable = false
      this.$message.success('绑定语音设备信息成功')
      this.search()
    },
    handleDevBindInfoUnbindClose() {
      this.devBindInfoUnbind.visiable = false
      this.search()
    },
    handleDevBindInfoUnbindSuccess() {
      // console.log(this.devBindInfoCancel.visiable, 'rrr')
      this.devBindInfoUnbind.visiable = false
      this.$message.success('解绑语音设备信息成功')
      this.search()
    },

    handleDevBindInfoUseClose() {
      this.devBindInfoUse.visiable = false

      this.search()
    },
    handleDevBindInfoUseSuccess() {
      this.devBindInfoUse.visiable = false
      this.$message.success('启用语音设备信息成功')

      this.search()
    },


    handleDevBindInfoImportClose() {
      this.devBindInfoUpload.visiable = false
      this.search()
    },


    viewInfo(record) {
      let bindMchntNo = record.bindMchntNo
      if (bindMchntNo) {
        record.mchntNo = record.bindMchntNo + '-' + record.mchntName
      }
      record.bindType = record.remark5
      this.$refs.devBindInfoInfo.setDevBindInfoFormValues(record)

      this.devBindInfoInfo.visiable = true
    },
    handleDevBindInfoInfoClose() {
      this.devBindInfoInfo.visiable = false
      this.devBindInfoInfo.data = {}
      this.search()
    },


    editInfo(record) {
      if (record.recordStatus === 'N') {
        this.$message.warning('停用、注销终端不能修改')
      } else {
        let bindMchntNo = record.bindMchntNo
        if (bindMchntNo) {
          record.mchntNo = record.bindMchntNo + '-' + record.mchntName
        }
        record.bindType = record.remark5
        // console.log(record)
        // setTimeout(() => {
        this.$refs.devBindInfoEdit.setDevBindInfoFormValues(record)
        // }, 1000);
        this.devBindInfoEdit.visiable = true
      }
    },

    handleDevBindInfoEditSuccess() {
      this.devBindInfoEdit.visiable = false
      this.$message.success('修改语音设备信息成功')
      this.search()
    },
    handleDevBindInfoEditClose() {
      this.devBindInfoEdit.visiable = false
      this.devBindInfoInfo.data = {}
      this.search()
    },

    search() {
      this.$refs.TableInfo.pagination.current = this.pagination.defaultCurrent
      if (this.paginationInfo) {
        this.paginationInfo.current = this.pagination.defaultCurrent
        this.paginationInfo.pageSize = this.pagination.defaultPageSize
      }

      this.dataSource = []
      let { sortedInfo, filteredInfo } = this
      let sortField, sortOrder
      // 获取当前列的排序和列的过滤规则
      if (sortedInfo) {
        sortField = sortedInfo.field
        sortOrder = sortedInfo.order
      }
      let params = {}
      params.instId = this.queryParams.instId
      params.bindDevType = this.queryParams.bindDevType
      params.bindStatus = this.queryParams.bindStatus
      params.msgPushKey = this.queryParams.msgPushKey
      params.bindMchntNo = this.queryParams.mchntNo

      this.fetch({
        sortField: sortField,
        sortOrder: sortOrder,
        ...params,
        ...filteredInfo
      })
    },
    reset() {
      // 取消选中
      this.selectedRowKeys = []
      this.bindMchntNData = []
      // 重置分页
      this.$refs.TableInfo.pagination.current = this.pagination.defaultCurrent
      if (this.paginationInfo) {
        this.paginationInfo.current = this.pagination.defaultCurrent
        this.paginationInfo.pageSize = this.pagination.defaultPageSize
      }
      // 重置列排序规则
      this.sortedInfo = null
      // 重置查询参数
      this.queryParams = {}
      // // 清空时间选择
      // this.$refs.createTime.reset()
      this.fetch()
    },
    handleTableChange(pagination, filters, sorter) {
      this.$refs.TableInfo.pagination.current = this.pagination.defaultCurrent
      if (this.paginationInfo) {
        this.paginationInfo.current = this.pagination.defaultCurrent
        this.paginationInfo.pageSize = this.pagination.defaultPageSize
      }

      // 将这三个参数赋值给Vue data，用于后续使用
      this.paginationInfo = pagination
      this.filteredInfo = filters
      this.sortedInfo = sorter

      this.fetch({
        sortField: sorter.field,
        sortOrder: sorter.order,
        ...this.queryParams,
        ...filters
      })
    },
    fetch(params = {}) {
      this.loading = true
      if (this.paginationInfo) {
        // 如果分页信息不为空，则设置表格当前第几页，每页条数，并设置查询分页参数
        this.$refs.TableInfo.pagination.current = this.paginationInfo.current
        this.$refs.TableInfo.pagination.pageSize = this.paginationInfo.pageSize
        params.pageSize = this.paginationInfo.pageSize
        params.pageNum = this.paginationInfo.current
      } else {
        // 如果分页信息为空，则设置为默认值
        params.pageSize = this.pagination.defaultPageSize
        params.pageNum = this.pagination.defaultCurrent
      }
      this.$get('devBindInfo', {
        ...params
      }).then((r) => {
        let data = r.data
        const pagination = { ...this.pagination }
        pagination.total = data.total
        for (var i = 0; i < data.rows.length; i++) {
          data.rows[i].id = i
        }
        // console.log(data.rows)
        this.dataSource = data.rows
        this.pagination = pagination
        this.loading = false
      })
    }
  }
}
</script>

<style lang="less" scoped>
@import "../../../../../static/less/Common";
</style>

